<!DOCTYPE>
<html>
<head>
    <meta charset="utf-8">
    <title>eoe Android客户端html5版</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">

    <link rel="stylesheet" href="css/Jingle.min.css">
    <link rel="stylesheet" href="css/app.css">
    <link rel="stylesheet" href="css/pygments.css">
</head>
<body>
    <div id="aside_container">
        <aside id="index_aside" data-position="left" data-transition="reveal" data-show-close="true">
            <div class="header" style="height: 46px;text-align: left">
                <img src="images/dis_eoelogo.png" style="height: 30px;margin:6px 10px">
            </div>
            <div class="center" data-scroll="true" style="position:relative;">
                <ul class="menu">
                    <li><a href="#" data-icon="next" data-selected="selected" class="selected" data-url="topURL">社区精选</a></li>
                    <li><a href="#" data-icon="next" data-selected="selected" data-url="newsURL">新闻资讯</a></li>
                    <li><a href="#" data-icon="next" data-selected="selected" data-url="wikiURL">学习教程</a></li>
                    <li><a href="#" data-icon="next" data-selected="selected" data-url="blogURL">社区博客</a></li>
                </ul>
            </div>
            <div style="height: 51px;text-align: center;line-height: 51px;border-top:1px silver solid" class="grid">
                <a class="one-part" data-target="section" href="#about_section" data-icon="info" style="display: block;">关于</a>
            </div>
        </aside>
    </div>
    <div id="section_container">
        <section id="index_section" class="active">
            <header>
                <nav class="left">
                    <a data-target="menu" data-icon="menu" href="#index_aside"></a>
                </nav>
                <h1 class="title"></h1>
                <nav class="right">
                    <a href="#" id="btn_show_user" data-icon="user" style="padding-left: 15px;"></a>
                </nav>
            </header>
            <nav class="header-secondary">
                <div class="grid"></div>
                <i class="icon next" ></i>
            </nav>
            <article id="index_article"class="active">
                <div>
                </div>
            </article>
            <script type="text/html" id="tpl_category">
                {each $data}
                <a href="#" data-index="{$index}" {if $index == 0}class="active"{/if} >{$value.name}</a>
                {/each}
            </script>
            <script type="text/html" id="tpl_article_list">
                {each $data}
                <div class="list-container" data-url = "{$value.url}">
                    <div>
                        <ul class="list" data-name="{$value.name}">
                            {include 'tpl_article_list_li' $value.items}
                        </ul>
                        <button class="block"style="background-color:#eee;color:#666 !important;" data-url="{$value.more_url}">点击加载更多</button>
                    </div>
                </div>
                {/each}
            </script>
            <script type="text/html" id="tpl_article_list_li">
                {each $data}
                <li class="grid" data-url="{$value.detail_url}">
                    {if $value.name}
                    <div style="margin-right:4px;">
                        <img src="{$value.head_image_url}" width="48" height="48">
                        <p class="ellipsis" style="font-size:.8em;width:48px;">{$value.name}</p>
                    </div>
                    {/if}
                    <div class="one-part">
                        <strong>{$value.title}</strong>
                        <p>{$value.short_content}</p>
                    </div>
                </li>
                {/each}
            </script>
        </section>
    </div>
	<script type="text/javascript" src="js/lib/cordova.js"></script>
    <!-- lib -->
    <script type="text/javascript" src="js/lib/zepto.js"></script>
    <script type="text/javascript" src="js/lib/template.min.js"></script>
    <script type="text/javascript" src="js/lib/iscroll.js"></script>
    <script type="text/javascript" src="js/lib/Jingle.debug.js"></script>
    <script type="text/javascript" src="js/lib/pgPlugin.js"></script>
    <!--- app --->
    <script type="text/javascript" src="js/app/app.js"></script>
    <script type="text/javascript" src="js/app/eoeAPI.js"></script>
</body>
</html>